<template>
  <Container class="fund-check-list">
    <div class="container-header title title-center" slot="header">
      {{year}}-{{month}}{{storeName}}基金明细
      <Button
        size="large"
        class="fl btn-back"
        icon="ios-arrow-back"
        @click="jumpPrevPage"
      >返回</Button>
    </div>
    <homeTable
    :translate="-65"
    :list="list"
    @getData="getData"
    @onPageSizeChange="onPageSizeChange"
    @onPageChange="onPageChange"
  />
  </Container>
</template>
<script>
import homeTable from '@/components/homeTable'
import { clearEmpty, formatDate } from '@/util'
export default {
  components: {
    homeTable
  },
  data() {
    return {
      tab: "tab1",
      id: this.$route.query.id,
      year: null,
      month: null,
      storeName: null,
      list: {
        status: 'pass',
        totalItem: 1,
        pageSize: window.$pageSize,
        currentPage: 1,
        columns: [{
          title: '商品',
          key: 'tiresName',
          minWidth: 140,
          align: 'left'
        }, {
          title: '基金',
          key: 'amount',
          minWidth: 150,
          align: 'right',
        }, {
          title: '获得基金',
          key: 'fundGetTypeMeaning',
          align: 'right',
          minWidth: 150
        }, {
          title: '轮胎条码',
          key: 'barcode',
          align: 'left',
           minWidth: 200
        }, {
          title: '入库时间',
          key: 'storeStockInDate',
          align: 'left',
          minWidth: 180
        }, {
          title: '备注',
          key: 'remark',
          align: 'left',
          minWidth: 200
        }],
        data: []
      }
    };
  },
  mounted() {
    this.list.currentPage = ~~this.$route.query.currentPage || 1;
    this.list.pageSize = ~~this.$route.query.pageSize || this.list.pageSize;
    this.getData()
  },
  methods: {
    jumpPrevPage() {
      this.$router.back()
    },
    getData() {
      this.list.status = "loading"
      let param = {
        storeFundMonthId: this.id,
        current: this.list.currentPage,
        size: this.list.pageSize,
      }
      param = clearEmpty(param)
      this.$ajaxGet(`/assets/fund_month/item`, param).then(data => {
        this.year = data.fundMonth ? data.fundMonth.year : null
        this.month = data.fundMonth ? data.fundMonth.month : null
        this.storeName = data.fundMonth ? data.fundMonth.storeName : null
        this.list.data = [];
        this.list.totalItem = Number(data.response.total)
        this.list.data = (data.response.records || []).map(item => {
          return {
            storeStockInDate: item.storeStockInDate,
            tiresName: item.tiresName,
            barcode: item.barcode,
            fundGetTypeMeaning: item.fundGetTypeMeaning,
            amount: item.amount,
            remark: item.remark ? item.remark : '无'
          }
        })
        this.list.status = "pass"
      }).catch(() => {
        this.list.status = "error"
      })
    },
    onPageChange(number) {
      this.list.currentPage = number
      this.$router.replace({
        name: "welfare/fundcheck/detail",
        query: {
          currentPage: this.list.currentPage,
          pageSize: this.list.pageSize,
          id: this.id
        }
      });
      this.getData()
    },
    onPageSizeChange(pageSize) {
      this.list.currentPage = 1;
      this.list.pageSize = pageSize;
      this.$router.replace({
        name: "welfare/fundcheck/detail",
        query: {
          currentPage: this.list.currentPage,
          pageSize: this.list.pageSize,
          id: this.id
        }
      })
      this.getData()
    }
  }
}
</script>
